<template>
<view class="threadMySearch">
	<uni-easyinput v-model="formData.name" placeholder="请输入名称/联系人" />
	
	<uni-easyinput v-model="formData.phone" placeholder="请输入手机号" />
	
	<uni-data-select v-model="formData.stage"  placeholder="请选择跟进阶段" :localdata="stages"/>
	
	<uni-data-select v-model="formData.unfollowedDay" placeholder="请输入未跟进天数" :localdata="unfollowedDays"/>
	
	<uni-data-select v-model="formData.class"  placeholder="请选择客户等级" :localdata="classs"/>
	
	<!-- <uni-data-select v-model="formData.clientPool"  placeholder="请选择客户池" /> -->
	
	<uni-data-select v-model="formData.source"  placeholder="请选择来源渠道" :localdata="sources"/>
	
	<uni-data-select v-model="formData.label"  placeholder="请选择标签" :localdata="certifications"/>
	
	<uni-data-select v-model="formData.car"  placeholder="请选择车产" :localdata="cars"/>
	
	<uni-data-select v-model="formData.house"  placeholder="请选择房产" :localdata="houses"/>
	
	<!-- <uni-data-select v-model="formData.principal"  placeholder="请选择跟进人" /> -->
	
	<uni-easyinput v-model="formData.remark" placeholder="备注"></uni-easyinput>
	
	<uni-easyinput v-model="formData.record" placeholder="跟进记录"></uni-easyinput>
	
	<uni-data-select v-model="formData.work"  placeholder="请选择部门" :localdata="works"/>
	
	<uni-datetime-picker
		start-placeholder="创建时间"
		end-placeholder="创建时间"
		v-model="formData.upload_time"
		type="daterange"
	/>
	
	<view class="btn_box">
		<button class="btn" type="default" size="mini" @click="reset">重置</button>
		<button class="btn" type="primary" size="mini" @click="search">搜索</button>
	</view>
</view>	
</template>

<script>
import { mapActions } from 'vuex';
import { 
	educations,
	works,
	certifications,
	stages,
	unfollowedDays,
	sources,
	cars,
	houses,
	classs
} from '@/common/formItemSelect.js'
import {getNonStringProperties} from '@/utils/common.js'
export default{
	data(){
		return {
			formData:{
				name: "",
				phone: "",
				// 单位类型
				work: "",
				// 备注信息
				remark: "",
				// 提交时间
				upload_time: "",
				// 标签、资质
				label: "",
				// 房产
				house: "",
				// 车产
				car:"",
				// 跟进记录
				record: "",
				// 来源渠道
				source: "",
				// 客户等级
				class: "",
				// 跟进阶段
				stage:"",
				// 未跟进天数
				unfollowedDay: "",
			},
			works:[],
			houses: [],
			cars:[],
			// 跟进人
			principal: "",
			certification: [],
			certifications:[],
			sources: [],
			classs: [],
			stages:[],
			unfollowedDays: []
		}
	},

	mounted() {
		this.educations = educations
		this.works = works
		this.certifications = certifications
		this.stages = stages
		this.unfollowedDays = unfollowedDays
		this.sources = sources
		this.houses = houses
		this.cars = cars
		this.classs = classs
		
	},
	inject: ['resetPagination'],
	
	methods:{
		...mapActions('threadMy', ['getThreadData', 'getDataCount']),
		
		reset(){
			this.formData = {
				name: "",
				phone: "",
				// 单位类型
				work: "",
				// 备注信息
				remark: "",
				// 提交时间
				upload_time: "",
				// 标签、资质
				label: "",
				// 房产
				house: "",
				// 车产
				car:"",
				// 跟进记录
				record: "",
				// 来源渠道
				source: "",
				// 客户等级
				class: "",
				// 跟进阶段
				stage:"",
				// 未跟进天数
				unfollowedDay: "",
			}
		},
		
		search(){
			this.$store.commit('threadMy/setCurrent', 1)
			this.resetPagination()
			this.$store.commit('threadMy/setShowHintInfo', false);
			this.$store.dispatch('threadMy/getThreadData', getNonStringProperties(this.formData))
		}
	}
}
</script>

<style lang="scss" scoped>
.threadMySearch{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
	grid-gap: 10px 20px;
	.btn_box{
		width: 100%;
		display: flex;
		justify-content: center;
		.btn{
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 0 26px;
		}
	}
}
</style>